<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=windows-1251">
<link href="style/editor.css" rel="stylesheet" type="text/css">
<script>
  var sLangDir=dialogArguments.oUtil.langDir;
  document.write("<scr"+"ipt src='language/"+sLangDir+"/source_html.js'></scr"+"ipt>");
</script>
<script>writeTitle()</script>
<script>
function doCmd(sCmd,sOption)
  {
  var oSel=idSource.document.selection.createRange();
  var sType=idSource.document.selection.type;
  var oTarget=(sType=="None"?idSource.document:oSel);
  oTarget.execCommand(sCmd,false,sOption);
  }
function jsReplace(sText, sFind, sReplace)
  {
  var arrTmp = sText.split(sFind);
  if (arrTmp.length > 1) sText = arrTmp.join(sReplace);
  return sText;
  }
var sBodyHeader;
var sBodyFooter;
var sBodyTag;

function bodyOnLoad()
  {
  var oEditor=dialogArguments.oUtil.oEditor;
  var obj = dialogArguments.oUtil.obj;

  var sHTML="";
  sHTML=oEditor.document.documentElement.outerHTML;
  sHTML=jsReplace(sHTML," contentEditable=true","");
  
  if(obj.docType!="")sHTML=obj.docType+"\n"+sHTML;//restore doctype (if any)

  idSource.document.body.innerText=sHTML;
  idSource.document.body.style.cssText="overflow-x:scroll;overflow-y:scroll;white-space:nowrap";

  idSource.document.body.contentEditable=true;  
  idSource.document.body.clearAttributes;
  idSource.document.body.style.marginTop='4';
  idSource.document.body.style.marginLeft='10';
  idSource.document.body.style.fontFamily='Tahoma';
  idSource.document.body.style.fontSize='11px';
  idSource.document.body.style.color='black';
  idSource.document.body.style.background='white';
  idSource.document.body.onkeydown = new Function("doKeyPress(idSource.event)");
  
  doWrap()
  }
function doKeyPress(evt)
  {
  if (evt.keyCode==13)
    {
    var thisSel = document.selection.createRange();
    thisSel.pasteHTML('<br>');
    evt.cancelBubble = true;
    evt.returnValue = false;
    thisSel.select();
    thisSel.moveEnd("character", 1);
    thisSel.moveStart("character", 1);
    thisSel.collapse(false);
    return false;
    idSource.focus();
    }
  if (evt.ctrlKey)
    {
    if(evt.keyCode==65)doCmd("SelectAll");
    }
  }
function doUpdate()
  {
  dialogArguments.oUtil.obj.saveForUndo();
  
  var obj = dialogArguments.oUtil.obj;
  obj.putHTML(idSource.document.body.innerText);//tdk menggunakan loadHTML() krn loadHTML() hanya utk first load.
  
  //*** RUNTIME STYLES ***
  obj.runtimeBorder(false);
  obj.runtimeStyles();
  //***********************
  }

function doWrap()
  {
  if(inpWrap.checked==true)
    {
    //Wrap Text
    idSource.document.body.style.whiteSpace="normal";
    }
  else
    {
    idSource.document.body.style.whiteSpace="nowrap";
    }
  }

//*******************
var buttonArrays=[];
var buttonArraysCount=0;
function writeIconStandard(id,command,img,title)
  {
  var oEditor=dialogArguments.oUtil.oEditor;
  try{var oSel=oEditor.document.selection.createRange();}
  catch(e){return "";}
  var obj = dialogArguments.oUtil.obj;
  w=obj.iconWidth;
  h=obj.iconHeight;
  imgPath=obj.iconPath+img;
  sHTML=""+
    "<td unselectable='on' style='padding-right:1px;VERTICAL-ALIGN: top;margin-left:0;margin-right:1px;margin-bottom:1px;width:"+w+"px;height:"+h+"px;'>"+
    "<span unselectable='on' style='position:absolute;clip: rect(0 "+w+"px "+h+"px 0)'>"+
    "<img name=\""+id+"\" id=\""+id+"\" btnIndex=\""+buttonArraysCount+"\" unselectable='on' src='"+imgPath+"' style='position:absolute;top:0;width:"+w+"px'"+
    "onmouseover='doOver(this)' "+
    "onmouseout='doOut(this)' "+
    "onmousedown='doDown(this)' "+
    "onmouseup=\"if(doUp(this)){"+command+"}\" alt=\""+title+"\">"+
    "</span></td>";
  sHTML="<table align=left cellpadding=0 cellspacing=0 style='table-layout:fixed;'><tr>"+sHTML+"</tr></table>";
  buttonArrays.push(["inactive"]);
  buttonArraysCount++;
  return sHTML;
  }
  
function writeBreakSpace()
  {
  var oEditor=dialogArguments.oUtil.oEditor;
  try{var oSel=oEditor.document.selection.createRange();}
  catch(e){return "";}
  var obj = dialogArguments.oUtil.obj;
  w=obj.iconWidth;
  h=obj.iconHeight;
  imgPath=obj.iconPath+"brkspace.gif";
  sHTML=""+
    "<td unselectable='on' style='padding-left:0px;padding-right:0px;VERTICAL-ALIGN:top;margin-bottom:1px;width:5px;height:"+h+"px;'>"+
    "<img unselectable='on' src='"+imgPath+"'></td>";
  sHTML="<table align=left cellpadding=0 cellspacing=0 style='table-layout:fixed;'><tr>"+sHTML+"</tr></table>";
  return sHTML;
  }

function setupToolbar()
  {
  var obj = dialogArguments.oUtil.obj;
  var sHTMLIcons="";
  sHTMLIcons+=writeIconStandard("btnCut","doCmd('Cut')","btnCut.gif",getTxt("Cut"));
  sHTMLIcons+=writeIconStandard("btnCopy","doCmd('Copy')","btnCopy.gif",getTxt("Copy"));
  sHTMLIcons+=writeIconStandard("btnPaste","doCmd('Paste')","btnPaste.gif",getTxt("Paste"));
  sHTMLIcons+=writeBreakSpace();
  sHTMLIcons+=writeIconStandard("btnUndo","doCmd('Undo')","btnUndo.gif",getTxt("Undo"));
  sHTMLIcons+=writeIconStandard("btnRedo","doCmd('Redo')","btnRedo.gif",getTxt("Redo"));
  sHTMLIcons+=writeBreakSpace();
  sHTMLIcons+=writeIconStandard("btnSearch","modelessDialogShow('search2.htm',375,163)","btnSearch.gif",getTxt("Search"));
  sHTML="<table border=0 cellpadding=0 cellspacing=0 width='100%'>"+
    "<tr><td colspan=2>"+
    "<table cellpadding=0 cellspacing=0 width=100%><tr><td dir=ltr style=\"padding-left:1px;background:url('"+obj.scriptPath+"icons/bg.gif')\">"+
    sHTMLIcons+
    "</td></tr></table>"+
    "</td></tr></table>";
  idToolbar.innerHTML=sHTML;
  }
function doOver(btn)
  {
  btnArr=buttonArrays[btn.btnIndex];
  if(btnArr[0]=="inactive")btn.style.top=-25;//no.2
  }
function doDown(btn)
  {
  btnArr=buttonArrays[btn.btnIndex];
  if(btnArr[0]!="disabled")btn.style.top=-50;//no.3
  }
var bCancel=false;
function doOut(btn)
  {
  if(btn.style.top=="-50px")
    {
    //lagi pushed tapi mouseout (cancel)
    bCancel=true;
    }

  btnArr=buttonArrays[btn.btnIndex];
  if(btnArr[0]=="active")btn.style.top=-75;//no.4 (remain active/pushed)
  if(btnArr[0]=="inactive")btn.style.top=0;//no.1 (remain inactive)
  }
function doUp(btn)//return true/false
  {
  if(bCancel)
    {
    //lagi pushed tapi mouseout (cancel)
    bCancel=false;btn.style.top=0;
    return false;
    }
  btnArr=buttonArrays[btn.btnIndex];
  if(btnArr[0]=="disabled") return false;
  btn.style.top=-25;//no.2
  return true;
  }
//*******************
function modelessDialogShow(url,width,height)
  {
  window.showModelessDialog(url,window,
    "dialogWidth:"+width+"px;dialogHeight:"+height+"px;edge:Raised;center:1;help:0;resizable:1;");
  }
</script>
</head>
<body onload="setupToolbar();loadTxt();bodyOnLoad()" style="overflow:hidden;margin:0;background: #f4f4f4;">

<table width="100%" height="100%" align="center" cellpadding="0" cellspacing="0">
<tr>
<td id="idToolbar">

</td>
</tr>
<td style="height:100%">
  <iframe style="width:100%;height:100%;" src="blank.gif"  name="idSource" id="idSource" contentEditable="true"></iframe>
</td>
</tr>
<tr>
<td class="dialogFooter" style="padding:13;padding-top:7;padding-bottom:7;" align="right" valign="right">
  <table cellpadding=1 cellspacing=0>
  <td width=100%>
    &nbsp;<input type="checkbox" ID="inpWrap" NAME="inpWrap" class="inpChk" onclick="doWrap()" checked> <span id="txtLang" name="txtLang">Wrap Text</span>
  </td>
  <td>
    <input type="button" name="btnCancel" id="btnCancel" value="cancel" onclick="self.close()" class="inpBtn" onmouseover="this.className='inpBtnOver';" onmouseout="this.className='inpBtnOut'">
  </td>
  <td>
    <input type="button" name="btnApply" id="btnApply" value="apply" onclick="doUpdate();bodyOnLoad()" class="inpBtn" onmouseover="this.className='inpBtnOver';" onmouseout="this.className='inpBtnOut'">
  </td>
  <td>
    <input type="button" name="btnOk" id="btnOk" value="ok" onclick="doUpdate();self.close()" class="inpBtn" onmouseover="this.className='inpBtnOver';" onmouseout="this.className='inpBtnOut'">
  </td>
  </table>
</td>
</tr>
</table>

</body>
</html>